<template>
  <ekDialog
    v-model="ekVisiable"
    title="审核"
    @submit="handleSubmit"

  >
    <div class="ek-form" v-loading="loading">
      <el-form
        :model="form"
        :rules="rules"
        label-width="160px"
        ref="forms"
        v-if="!loading"
      >
        <el-form-item prop="transfer_price" label="订单金额">
            <ekInput v-model="detail.base_data.transfer_price" :disabled="true" />
        </el-form-item>
        <el-form-item prop="transfer_audit_image" label="转账图片">

              <el-image
              style="width:200px; "
              :src="$imageBaseUrl + detail.base_data.transfer_audit_image[0]"
              :zoom-rate="1.2"
              :max-scale="7"
              :min-scale="0.2"
              :preview-src-list="[$imageBaseUrl + detail.base_data.transfer_audit_image[0]]"
              :initial-index="4"
              fit="cover"
              v-if="detail.base_data.transfer_audit_image.length"
            />
      
        </el-form-item>
        
        <el-form-item prop="transfer_audit_message" label="审核情况">
           <ekRadio v-model="form.transfer_pass" :options="[
            {
                value: 'pass',
                label: '通过',
            },
            {
                value: 'unpass',
                label: '驳回',
            }
            ]"
            :disabled="detail.base_data.pay_state =='2' ? true: false"
            />
        </el-form-item>
        <el-form-item prop="transfer_audit_message" label="审核意见">
          <ekInput v-model="form.transfer_audit_message" />
        
        </el-form-item>
      </el-form>
    </div>
  </ekDialog>
</template>

<script setup>
import {
  watch,
  getCurrentInstance,
  computed,
  reactive,
  ref,
  defineEmits,
} from "vue";
import { apis } from "../data.js";
import ekDialog from "@/components/business/ekDialog/index.vue";
import ekInput from "@/components/form/ekInput/index.vue";
import ekSelect from "@/components/form/ekSelect/index.vue";
import ekTableSelect from "@/components/form/ekTableSelect/index.vue";
import ekRadio from "@/components/form/ekRadio/index.vue";
import ekUploadImage from "@/components/form/ekUploadImage/index.vue";
import ekTip from "@/components/business/ekTip/index.vue";
import { objectAssignment } from "@/utils/common.js";
const props = defineProps({
  // 显示隐藏
  visiable: {
    type: Boolean,
    default: false,
  },
  rowId: {
    type: [String, Number],
    default: "",
  },
 
});
const {
  appContext: {
    config: { globalProperties },
  },
} = getCurrentInstance();
const { $storage, $http, $ekLoading, $ekMessage,  $imageBaseUrl  } = globalProperties;

const emit = defineEmits(["update:visiable", "submit"]);

// 是否显示
const ekVisiable = computed({
  get() {
    return props.visiable;
  },
  set(value) {
    emit("update:visiable", value);
  },
});

function handleSubmit(done) {
  let url = apis.audit
  forms.value.validate((valid) => {
    if (valid) {
      $http
        .request({
          url: url,
          method:"PUT",
          data: {
            ...form.value,
            id:  props.rowId
          },
        })
        .then((res) => {
          $ekMessage.success(res.message);
          emit("submit", done);
        })
        .catch((err) => {});
    }
  });
}
const loading = ref(false);
let forms = ref(null);
let form = ref({
  transfer_audit_message: "",
  transfer_pass: "pass",
  id: props.rowId,
});
let rules = reactive({
  transfer_pass: [
    { required: true, message: "请输入出库单号", trigger: "blur" },
  ]
});
const initForm = () => {
  form.value = {
    transfer_audit_message: "",
    transfer_pass: "pass",
    id: props.rowId,
  };
};
const detail = ref({

});
// 初始化表单
async function init() {
  loading.value = true;
  // 详情或者编辑
  if (props.rowId) {
    $http
      .get(apis.detail, {
        params: {
          id: props.rowId,
        },
      })
      .then((res) => {
        if (Object.keys(res.data).length) {
          detail.value = {
            ...detail.value,
            ...res.data,
          };
          objectAssignment(form.value, res.data);
          console.log(detail.value,'detail.value')
        }

        loading.value = false;
      });
  } else {
    loading.value = false;
  }
}
watch(
  () => props.visiable,
  (val) => {
    if (val) {
      initForm();
      init();
    }
  }
);
</script>

<style scoped lang="scss"></style>
